<template>
  <div>
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="活动名称">
        <el-input v-model="form.releaseName"></el-input>
      </el-form-item>
      <el-form-item label="活动性质">
        <el-radio v-model="form.releaseType" label="美食/餐厅线上活动"
          >美食/餐厅线上活动</el-radio
        >
        <el-radio v-model="form.releaseType" label="线下主题活动"
          >线下主题活动</el-radio
        >
        <el-radio v-model="form.releaseType" label="地推活动"
          >地推活动</el-radio
        >
        <el-radio v-model="form.releaseType" label="单纯品牌曝光"
          >单纯品牌曝光</el-radio
        >
      </el-form-item>
      <el-form-item label="活动简介">
        <el-input type="textarea" v-model="form.releaseContent"></el-input>
      </el-form-item>
      <el-form-item label="活动图片" prop="file">
        <el-upload
          class="upload-demo"
          ref="upload_img"
          multiple
          action=""
          name="file"
          accept=".jpg, .png"
          :http-request="onSubmit"
          :auto-upload="false"
        >
          <el-button slot="trigger" size="small" type="primary"
            >选取文件</el-button
          >
          <div
            slot="tip"
            class="el-upload__tip"
            style="display: inline-block; margin-left: 20px"
          >
            只能上传jpg,png图片！
          </div>
        </el-upload>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit">立即创建</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
export default {
  data() {
    return {
      form: {
        releaseName: "",
        delivery: false,
        releaseType: "",
        releaseContent: "",
      },
    };
  },
  methods: {
    onSubmit() {
      //{header:{'Content-Type': 'multipart/form-data'}}
      // fileList.append("1",file);
      console.log("submit!");
      console.log("data:", this.form);
      let file = this.$refs.upload_img;
      console.log("file", file);
      console.log("uploadF",file.uploadFiles[0].raw);
      var fileData = new FormData();
      fileData.append("file",file.uploadFiles[0].raw);
      fileData.append("releaseName",this.form.releaseName);
      fileData.append("releaseType",this.form.releaseType);
      fileData.append("releaseContent",this.form.releaseContent);
      fileData.append("releasePerson",5);
      console.log("fileData",fileData);
      this.$axios
      .post("http://localhost:3653/activity/release",fileData,{headers:{'Content-Type': 'multipart/form-data'}})
      .then((res) => {
        console.log("res:", res);
        this.$router.go(0);
      });
    },
  },
};
</script>